let slideIndex1 = 0;
let timeoutId1;
const slides1 = document.querySelectorAll('.slide1');
const dots = document.querySelectorAll('.dot');
const duration1 = 3000; // 每张图片显示的持续时间，单位毫秒

function fadeOutAllBut1(index) {
  slides1.forEach((slide, idx) => {
    slide.style.transition = 'opacity 0.5s';
    slide.style.opacity = idx === index ? 1 : 0;
  });
  dots.forEach((dot, idx) => {
    dot.style.backgroundColor = idx === index ? 'red' : 'white';
  });
}

function showNextSlide1() {
  clearTimeout(timeoutId1); // 清除之前的定时器
  slideIndex1 = (slideIndex1 + 1) % slides1.length;
  fadeOutAllBut1(slideIndex1);
  
  // 设置新的定时器
  timeoutId1 = setTimeout(() => {
    showNextSlide1();
  }, duration1);
}

// 为每个指示器点添加点击事件
document.querySelectorAll('.dot').forEach((dot, index) => {
  dot.addEventListener('click', function() {
    slideIndex1 = index;
    fadeOutAllBut1(slideIndex1);
    
    // 设置定时器，如果已经存在，则清除旧的定时器
    if (timeoutId1) {
      clearTimeout(timeoutId1);
    }
    timeoutId1 = setTimeout(() => {
      showNextSlide1();
    }, duration1);
  });
});

// 初始化并启动轮播
showNextSlide1();